import React, { useState } from 'react';
import { ProForm, ProFormText, ProFormSelect, ProFormTextArea, ProFormGroup } from '@ant-design/pro-components';
import { Button, Descriptions, message, Modal, Steps } from 'antd';
import { useRequest } from 'umi';
import { updateAudit, updateRefuse, } from '@/services/ant-design-pro/audit'; // 假设你已经定义了这些服务

const AuditForm: React.FC = ({ initialValues, isEditMode, onClose, onSuccess }) => {
  console.log(initialValues,'-initialValues')
  const [isModalVisible, setIsModalVisible] = useState(false);
  const [auditStatus, setAuditStatus] = useState(null);
  const [rejectReason, setRejectReason] = useState('');
  const { run: runUpdateAudit } = useRequest((values) => updateAudit(values), {
    manual: true,
    onSuccess: () => {
      message.success('审批成功');
      onClose();
      onSuccess();
    },
    onError: () => {
      // message.error('审批失败');
      console.log('审批失败')
    },
  });
  
  const { run: runUpdateRefuse } = useRequest((values) => updateRefuse({id:values.id,reason:values.rejectReason}), {
    manual: true,
    onSuccess: () => {
      message.success('驳回成功');
      onClose();
      onSuccess();
    },
    onError: () => {
      message.error('驳回失败');
    },
  });

  const handleAudit = () => {
    setIsModalVisible(true);
    setAuditStatus(null);
    setRejectReason('');
  };

  const handleModalOk = async () => {
    if (auditStatus == 22 && !rejectReason) {
      message.error('请填写拒绝理由');
      return;
    }
    if (auditStatus == 21) {
      await runUpdateAudit({ ...initialValues, auditStatus });
    } else if (auditStatus == 22) {
      await runUpdateRefuse({ ...initialValues, auditStatus, rejectReason });
    }
    setAuditStatus(null);
    setRejectReason('');
    setIsModalVisible(false);
  };

  const handleModalCancel = () => {
    setAuditStatus(null);
    setRejectReason('');
    setIsModalVisible(false);
  };

  return (
    <div>
      <Descriptions title="购买人信息" bordered style={{ marginTop: 24 }} layout="vertical">
  <Descriptions.Item label="购买人名称">{initialValues?.buyUserName || '-'}</Descriptions.Item>
  <Descriptions.Item label="购买人联系方式">{initialValues?.buyUserPhone || '-'}</Descriptions.Item>
</Descriptions>

<Descriptions title="产品详情" bordered style={{ marginTop: 24 }} layout="vertical">
    </Descriptions>
        {initialValues?.orderDetailList?.map((detail, index) => (
          <React.Fragment key={index}>
             <Descriptions title={detail.orderName } bordered style={{ marginTop: 24 }} layout="vertical">
           {/* <Descriptions.Item label="产品名称">{detail.orderName || '-'}</Descriptions.Item> */}
           <Descriptions.Item label="服务编号">{detail?.orderCode || '-'}</Descriptions.Item>
           <Descriptions.Item label="服务城市">{detail?.serviceCity || '-'}</Descriptions.Item>
           <Descriptions.Item label="调用方式">{detail?.callWay || '-'}</Descriptions.Item>
            <Descriptions.Item label="调用量">{detail?.callCount || '-'}</Descriptions.Item>
            <Descriptions.Item label="全球城市">{detail?.globalCity || '-'}</Descriptions.Item>
            {/* <Descriptions.Item label="调用方式编码">{detail.callWayCode || '-'}</Descriptions.Item> */}
            <Descriptions.Item label="服务时长">{detail?.serviceTime || '-'}</Descriptions.Item>
            <Descriptions.Item label="生效时间">{detail?.effectTime || '-'}</Descriptions.Item>
            <Descriptions.Item label="使用状态">{detail?.useStatus === 0 ? '待使用' : detail.useStatus === 1 ? '使用中' : detail.useStatus === 2 ? '已关闭' : detail.useStatus === 3 ? '待生效' : '开通中'}</Descriptions.Item>
            <Descriptions.Item label="到期时间">{detail?.expirationTime || '-'}</Descriptions.Item>
            <Descriptions.Item label="费用">{detail?.amount || '-'}</Descriptions.Item>
            </Descriptions>
          </React.Fragment>
        ))}

<Descriptions title="订单详情" bordered style={{ marginTop: 24 }} layout="vertical">
  <Descriptions.Item label="订单编码">{initialValues?.orderCode || '-'}</Descriptions.Item>
  <Descriptions.Item label="下单时间">{initialValues?.orderTime || '-'}</Descriptions.Item>
  <Descriptions.Item label="订单金额">{initialValues?.orderAmount || '-'}</Descriptions.Item>
  <Descriptions.Item label="支付时间">{initialValues?.payTime || '-'}</Descriptions.Item>
  <Descriptions.Item label="支付类型">{initialValues?.payType === '0' ? '支付宝' : initialValues?.payType === '1' ? '微信' : initialValues?.payType === '2' ? '对公支付' : '-'}</Descriptions.Item>
 {!initialValues?.applicationReason && <Descriptions.Item label="订单修改金额">{initialValues?.editOrderAmount || '-'}</Descriptions.Item>}
 {initialValues?.submitTime&& <Descriptions.Item label="申请退款时间">
    {initialValues?.submitTime}
  </Descriptions.Item>}
</Descriptions>

  <Descriptions title="审批详情" bordered style={{ marginTop: 24 }} layout="vertical">
  {initialValues?.applicationReason &&<><Descriptions.Item label="退款理由">{initialValues?.applicationReason || '-'}</Descriptions.Item><Descriptions.Item label="原因说明">{initialValues?.applicationRemark || '-'}</Descriptions.Item></>}
  {initialValues?.reason && <Descriptions.Item label="驳回原因">{initialValues?.reason || '-'}</Descriptions.Item>}
  <Descriptions.Item label="审核状态">
    {initialValues?.auditStatus === 20 ? '待审核' :
     initialValues?.auditStatus === 21 ? '已审核' :
     initialValues?.auditStatus === 22 ? '已驳回' : '已驳回'}
  </Descriptions.Item>
  </Descriptions>
  <Descriptions title="审批记录" bordered style={{ marginTop: 24 }} layout="vertical">
{initialValues?.auditFlowVos?.map((detail, index) => (


           <>
               <Descriptions.Item label="审核人">{detail?.auditName || '-'}</Descriptions.Item>
           <Descriptions.Item label="审批时间">{detail?.auditTime || '-'}</Descriptions.Item><Descriptions.Item label="审核状态">
    {detail.auditStatus === 20 ? '待审核' :
      detail.auditStatus === 21 ? '已审核' :
        detail.auditStatus === 22 ? '已驳回' : '已驳回'}

  </Descriptions.Item></>


        ))}

</Descriptions>

<Descriptions title="审批流程" bordered style={{ marginTop: 24 }} layout="vertical">
  <Descriptions.Item label="审批流程">
    <Steps current={initialValues?.currentAuditRoleName === -1 ? 0 :initialValues?.currentAuditRoleName} items={initialValues?.auditName} />
  </Descriptions.Item>
</Descriptions>

     {initialValues?.auditStatus === 20 && initialValues.auditButtonStatus === 0 && (
       <Button type="primary" onClick={handleAudit} style={{ marginTop: 16} }>审批</Button>
)
}

      <Modal
        title="审批"
        open={isModalVisible}
        onOk={handleModalOk}
        onCancel={handleModalCancel}
      >
        <ProFormSelect
          name="auditStatus"
          label="审批结果"
          valueEnum={{ 21: '通过', 22: '拒绝' }}
          fieldProps={{
            value: auditStatus,
            onChange: (value) => setAuditStatus(value),
          }}
        />
        {auditStatus == 22 && (
          <ProFormTextArea
            name="rejectReason"
            label="拒绝理由"
            placeholder="请输入拒绝理由"
            fieldProps={{
              value: rejectReason,
              onChange: (e) => setRejectReason(e.target.value),
              maxLength: 50
            }}
          />
        )}
      </Modal>
    </div>
  );
};

export default AuditForm;